In Svelte, the {#await} block is used to handle asynchronous operations and promises directly in your template. It allows you to render different content based on the state of the promise — while it's pending, when it resolves, and if it fails.
{#await promise}is used to display content while the promise is still pending.{:then value}handles the resolved value of the promise.{:catch error}handles any error if the promise rejects.The block must be closed with a
{/await}statement.
This basic example shows how to handle all three states of a promise: pending, resolved, and rejected.
In this example, data is fetched from an API. While the request is loading, Svelte shows a loading message. When the promise resolves, it displays the user information. If there's an error, the error message is shown instead.